// wx://form-field
// 使自定义组件有类似于表单控件的行为。 form 组件可以识别这些自定义组件，并在 submit 事件中返回组件的字段名及其对应字段值
const nxItem = require('./nx-item');
import {
  formatTime
} from '../../utils/tools';
import {
  nxValidator
} from '../../components/nx-validator';

module.exports = Behavior({
  behaviors: ['wx://form-field', nxItem],
  /**
   * 组件的属性列表
   */
  properties: {
    /** 之所以将所有信息以对象的方式传入，是为了后面的数据验证 */
    props: {
      type: null,
      observer(props) {
        if (props) {
          if (!props.currentDate && props.value === undefined) {
            props.value = ""
            props.text = ""
          }
          if (props.currentDate && (props.value === undefined || props.value === null)) {
            if (props.type == 'time') {
              props.currentDate = props.currentDate;
            } else if (props.type == 'date') {
              props.currentDate = new Date(props.currentDate).getTime();
            } else if (props.type == 'datetime') {
              props.currentDate = new Date(props.currentDate).getTime();
            }
          }
          this.setData({
            ...this.data, //默认值
            title: '选择' + props.label, //默认值
            placeholder: props.placeholder || '请选择' + props.label, //默认值
            ...props, //新值
          });
        }
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    type: 'date', //date 、time 、datetime、year-month
    currentDate: '',
    show: false,
    text: ''
  },
  methods: {
    /** 弹出选择框 */
    onShowPicker(e) {
      this.setData({
        show: true
      });
    },
    /** 取消选择框 */
    onCancel: function (e) {
      const v = e.detail;
      const d = this.data;
      nxValidator(d, v).then(() => {
        this.setData({
          ...d,
          show: false
        });
      });
    },
    /** 确认选择器 */
    onConfirm: async function (e) {
      let text = ''
      const v = e.detail;
      const d = this.data;
      nxValidator(d, v).then(() => {
        if (this.data.type == 'time') {
          text = v
        } else if (this.data.type == 'date') {
          text = formatTime(v, 'YYYY-MM-DD')
        } else if (this.data.type == 'datetime') {
          text = formatTime(v)
        }

        this.setData({
          ...d,
          show: false,
          value: text,
          text,
        });
      });
    },
  },

  observers: {
    'type,value': function (type, value) {
      /** 当有初始value时，给text赋值 */
      let text = '';
      let currentDate = '';
      if (value) {
        if (type == 'time') {
          text = value;
          currentDate = value;
        } else if (type == 'date') {
          // text = formatTime(value, 'YYYY-MM-DD')
          text = value;
          currentDate = new Date(value).getTime();
        } else if (type == 'datetime') {
          // text = formatTime(value)
          text = value;
          currentDate = new Date(value).getTime();
        }
        this.setData({
          text,
          currentDate,
        });
      } else {
        this.setData({
          text,
        });
      }
    },
  },
})